<template>
	<div class="recommend">
		<div v-for="(item,index) in recommends" class="recommend-item" :key="index">
			<a :href="item.link">
				<img :src="item.image" alt="">
				<div>{{item.title}}</div>
			</a>
		</div>
	</div>
</template>

<script>
export default {

  name: 'RecommendView',
  props:{
  	recommends:{
  		type:Array,
  		default(){
  			return []
  		}
  	}

  },
  data () {
    return {

    }
  }
};
</script>

<style lang="css" scoped>
	.recommend{
		display: flex;
		width: 100%;
		text-align: center;
		font-size: 12px;
		padding: 10px 0 18px;
		border-bottom: 10px solid #eee;
	}
	.recommend-item{
		flex: 1;

	}
	.recommend-item img{
		width: 70px;
		height: 70px;
	}
</style>